<template>
    <div id="SecurityReconnaissance">
      <div class="top">
        <van-dropdown-menu>
          <van-dropdown-item v-model="value1" :options="option1" />
          <van-dropdown-item v-model="value2" :options="option2" />
          <van-dropdown-item v-model="value2" :options="option2" />
          <van-dropdown-item v-model="value2" :options="option2" />
        </van-dropdown-menu>
      </div>
      <div class="content">
        <ul>
          <li
            v-for="(item,index) in listData"
            :key="index"
            @click="listClick(item)"
          >
            <p style="font-weight: bold; margin-bottom: 10px;">
              <span style>上报人：{{ item.SBR }}</span>
            </p>
            <p style="font-size: 14px; color: #848484;height: 25px;">
              <span style="float: left">上报人电话：{{ item.SBRDH || "暂无数据" }}</span>
              <span v-if="item.SBSJ" style="float: right">上报时间：{{ item.SBSJ.split(' ')[0] }}</span>
            </p>
            <p style="clear: both;">
              <span style="font-size: 14px;">
                 房屋地址： {{item.XXDZ || "暂无数据"}}
              </span>
              <!--<span style="float: right;font-size: 14px;">{{item.RWZT}}</span>-->
            </p>
          </li>
        </ul>
      </div>
    </div>
</template>

<script>
  import { DropdownMenu, DropdownItem } from 'vant';
  import { FileServerProxy } from "@/utils/api";
  export default {
    name: "SecurityReconnaissance",
    data(){
      return{
        value1: 0,
        option1: [
          { text: '地市', value: 0 },
          { text: '新款商品', value: 1 },
          { text: '活动商品', value: 2 },
        ],
        value2: "a",
        option2: [
          { text: '区县', value: 'a' },
          { text: '好评排序', value: 'b' },
          { text: '销量排序', value: 'c' },
        ],
        listData:[]
      }
    },
    methods:{
      listClick(item){
        this.$router.push({
          path: "/ReconnaissanceDetails",
          query: {
            data: JSON.stringify(item),
          },
        });
      },
      getData: async function (){
        let params = {
          accessCode: '688bd3883572440a859dfd8ba9194e7b',
          cityCode: window.localStorage.getItem('citycode') ? window.localStorage.getItem('citycode') : '441300000000',
          params: {
            dataguid: "aa557eeb-4ea8-4b87-b1ed-34816b413d4b",
            searchObject: JSON.stringify([]),
            token: window.localStorage.getItem('token')
          }
        }
        const res = await FileServerProxy(params)
        let data = JSON.parse(res.data.data).Data
        this.listData = data
      },
    },
    mounted() {
      this.getData()
    }
  };
</script>

<style scoped lang="scss">
 #SecurityReconnaissance{
   .content{
     width: 100%;
     height: calc(100vh - 48px);
     overflow-y: auto;
     padding: 10px;
     ul li{
       padding: 10px;
       border-bottom: 1px solid #ccc;
     }
   }
 }
</style>
